<?php /*a:1:{s:100:"D:\ps\phpstudy_pro\WWW\tc6\public/themes/admin_simpleboot3/zhongmaotong\sp\add_goods_attr_value.html";i:1718335118;}*/ ?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>

<body>
<div id="app" style="margin: 20px 60px;">
    <el-form :inline="true" :model="form" class="demo-form-inline">
        <div v-for="(item, index) in form">
            <el-form-item :lable="'属性' + (index + 1)" >
                <el-select v-model="item.attr" placeholder="属性">
                    <el-option v-for="s in selectOptions" :label="s.name" :value="s.id"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item :lable="'属性值' + (index + 1)" >
                <el-input v-model="item.attr_value" placeholder="属性值"></el-input>
            </el-form-item>
            <el-button type="danger" @click="removeFormItem(index)">移除</el-button>
        </div>

        <div>
            <el-form-item>
                <el-button type="default" @click="addForm">添加表单项</el-button>
            </el-form-item>
        </div>

        <div>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">提交</el-button>
            </el-form-item>
        </div>

    </el-form>
</div>

</body>
<!-- 引入VUE -->
<script src="https://unpkg.com/vue@2.6.14/dist/vue.min.js"></script>
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
    v = new Vue({
        //指定元素
        el:"#app",
        data:{
            //商品id
            goods_id:"<?php echo $goods_id; ?>",
            //属性下拉框选项
            selectOptions:[],
            //表单项
            form:[
                {attr:'',attr_value:''},
            ]
        },
        methods:{
            addForm(){
                this.form.push({attr:'', attr_value:''})
            },
            removeFormItem(index){
                this.form.splice(index,1)
            },
            onSubmit(){
                $.ajax({
                    url:"<?php echo url('Sp/setGoodsAttrValuePost'); ?>",
                    type:'POST',
                    data: {
                        form:this.form
                    },
                    success(res){
                        if (res.code == 0){
                            alert(res.msg);
                        }else{
                            alert(res.msg);
                        }
                    },
                    error(){
                        alert('请求失败')
                    }
                })
            }
        },
        created(){
            $.ajax({
                url:"<?php echo url('Sp/GetGoodsAttrValue'); ?>",
                data: {
                    goods_id:this.goods_id
                },
                success(res){
                    v.selectOptions = res.data
                },
                error(){
                    alert('请求失败')
                }
            })
        }
    })
</script>
</html>